<template>
  <el-space v-bind="spaceProps">
    <template v-if="bodyType === 'content'">
      {{ body }}
    </template>
    <template v-else-if="bodyType === 'component'">
      <LowCode :schema="body" />
    </template>
    <template v-else-if="bodyType === 'components'">
      <LowCode v-for="(item, index) in body" :key="index" :schema="item" />
    </template>
  </el-space>
</template>

<script setup>
import LowCode from '@/components/LowCode.vue'
import { isDef, isPrimitive, isPlainObj } from '@/utils/index'
defineOptions({ name: 'SpaceCom' })

const props = defineProps({
  schema: {
    type: Object,
    required: true
  }
})

const _schema = props.schema
const spaceProps = _schema.props || {}
const body = _schema.body

let bodyType

if (isDef(body)) {
  if (isPrimitive(body)) {
    bodyType = 'content'
  } else if (isPlainObj(body)) {
    bodyType = 'component'
  } else if (Array.isArray(body)) {
    bodyType = 'components'
  }
}
</script>
